﻿@using MealBooking.Core.Models.Dishes;
@using MealBooking.Core.Models.Meals;
@model ThisIsFirstTest.Models.MealModel.NewMealModel
@{
    ViewBag.HeaderTitle = "Order New Meal";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@using (Html.BeginForm("OrderNewMeal", "Meal", FormMethod.Post))
{
    Dictionary<DishTemplate, List<Dish>> dishTemplatesInMealCategory = ViewBag.DishTemplatesInMealCategory;
    MealCategory mealCategory = ViewBag.MealCategory;    
        
    <input type="hidden" name="CategoryId" value="@mealCategory.Id" />
    <ul data-role="listview" data-inset="true" data-mini="true">
        @* <li data-role="list-divider">@mealCategory.Name[@mealCategory.Detail()]</li>*@
        @foreach (var dishCategory in dishTemplatesInMealCategory)
        {
            var dishes = dishCategory.Value;
            <li data-role="list-divider">
                @dishCategory.Key.Category.Name : <span class="ui-li-count">@dishes.Count</span></li>
            <li>
                <div class="clear ui-bar" data-role="controlgroup">
                    <input type="hidden" name="DishSum" id="@dishCategory.Key.Category.Id" value="@dishCategory.Key.DishSum" />
                    @foreach (var dish in dishes)
                    {
                        <input type="checkbox" name="DishIds" id="@dish.Id" class="@dishCategory.Key.Category.Id" value="@dish.Id"/>
                        <label title="@dish.Description" for="@dish.Id">@dish.Name
                            @if (mealCategory.Price == 0)
                            {
                                <span>[Price : @dish.Price] [@dish.Description]</span>
                            }
                        </label>
                    }
                </div>
            </li>
        }
    </ul>
    <ul data-role="listview" data-inset="true" data-mini="true">
        <li data-role="list-divider"></li>
        <li>
            @if (ViewBag.IsBooked)
            {
                <button data-icon="delete">
                    Already Booked. Can't Order Anymore.</button>
            }
            else
            {
                <div data-role="filedcontain" @*class="ui-grid-a"*@>
                    @*<div class="ui-block-a">
                        <input type="submit" disabled="disabled" value="Add To Order" />
                    </div>*@
                    <div @*class="ui-block-b"*@>
                        <input type="hidden" name="orderNow" value="true" />
                        <input type="submit" disabled="disabled" value="Order Now" />
                    </div>
                </div>
            }
        </li>
    </ul>    
}
@*<div class="ui-bar ui-bar-e">
    <span id="info">Selected :</span>
</div>*@
<script type="text/javascript">
    $("input[type='checkbox']").bind("change", change);
    $("form").submit(function () {
        if ($("input[name*='DishIds']:checked").length <= 0) {
            return false;
        }
    });
    //
    function change() {
        var dishSums = $("input[type='hidden'][name*='DishSum']");
        var count = 0;
        dishSums.each(function (i) {
            var dishSum = $(dishSums[i]).attr("value");
            var dishCategoryId = $(dishSums[i]).attr("id");
            if ($("input[type='checkbox'][name*='DishIds'][class='" + dishCategoryId + "']:checked").length == dishSum) {
                count++;
            }
        });
        if (count != dishSums.length) {
            $("[type='submit']").button("disable");
        }
        else {
            $("[type='submit']").button("enable");
        }
        $('input[type="checkbox"]').checkboxradio("refresh");
    }
</script>
